<template>
  <div class="shopping_car">
    <NavBar :isLeftBtn="false" title="新增地址" />
    <van-address-edit
      :area-list="areaList"
      show-postal
      show-delete
      show-set-default
      :address-info="addressInfo"
      show-search-result
      :area-columns-placeholder="['请选择', '请选择', '请选择']"
      @save="onSave"
      areaCode='150101'
      @delete="onDelete"
    />
  </div>
</template>
<script lang="ts">
import { defineComponent, reactive, toRefs } from "vue";
import NavBar from "@/components/NavBar.vue";
import { addAddress, DeleteAddress, EditAddress } from "@/utils/apis/address";
import { useRouter, useRoute } from "vue-router";
import areaList from "@/utils/area";
import { Toast } from "vant";
interface AddAddressParams {
  userName: string;
  userPhone: string;
  provinceName: string;
  cityName: string;
  regionName: string;
  detailAddress: string;
  defaultFlag: number;
  addressId?: number;
}
interface Content {
  name: string;
  tel: string;
  province: string;
  city: string;
  county: string;
  addressDetail: string;
  isDefault: number;
  address: string;
  id: number;
  areaCode: string;
  detailAddress: string;
}
interface Result {
  name: string;
  address: string;
}
export default defineComponent({
  name: "site",
  components: { NavBar },

  setup() {
    const state = reactive({
      list: [],
      searchResult: [],
      areaList: areaList,
      chosenAddressId: "-1",
      form: {} as Content,
      addressInfo: {} as Content,
    });
    const router = useRouter();
    const route = useRoute();
    const form: any = route.query.addressItem;
    if (form) {
      state.form = JSON.parse(form);
      state.addressInfo = state.form;
      state.addressInfo.addressDetail = state.form.detailAddress;

      //地址的回显
      const addressNew =  state.addressInfo.address.split('-')
      addressNew.pop()
      state.addressInfo.areaCode = '';
      for (const key in areaList.county_list) {
          const element: any = areaList.county_list[key];
          //  取地址最后一个编码 就可以回显
          if(element==addressNew[addressNew.length-1]){
            state.addressInfo.areaCode=key
          }
      }
    }

    //保存
    const onSave = async (content: Content) => {
      const params: AddAddressParams = {
        userName: content.name,
        userPhone: content.tel,
        provinceName: content.province,
        cityName: content.city,
        regionName: content.county,
        detailAddress: content.addressDetail,
        defaultFlag: content.isDefault ? 1 : 0,
      };
      if (JSON.stringify(state.form) == "{}") {
        await addAddress(params);
        Toast.success("新建成功");
      } else {
        params.addressId = content.id;
        await EditAddress(params);
        Toast.success("编辑成功");
      }

      router.replace({
        path: "/site",
      });
    };
    //删除
    const onDelete = async (content: Content) => {
      //
      // DeleteAddress
      // id
      await DeleteAddress(content.id);
      Toast.success("删除成功");
      router.replace({
        path: "/site",
      });
    };
    return {
      ...toRefs(state),
      onSave,
      onDelete,
    };
  },
});
</script>
<style lang="scss" scoped></style>
